import 'package:flutter/material.dart';

class ListViewWidget extends StatefulWidget {
  @override
  State<StatefulWidget> createState() => new ListViewState();
}

class ListViewState extends State<ListViewWidget> {
  @override
  Widget build(BuildContext context) {
    return ListViewStateless();
  }
}

class ListViewStateless extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    //标准构造函数
    Widget list1 = ListView(
      //ListView在滚动方向上每个item所占的高度值。
      itemExtent: 50,
      //滚动方向的滚动视图内容是否应该由正在查看的内容所决定。
      shrinkWrap: true,
      padding: const EdgeInsets.all(20),
      children: <Widget>[
        Text('I\'m dedicating every day to you'),
        Text('Domestic life was never quite my style'),
        Text('When you smile, you knock me out, I fall apart'),
        Text('And I thought I was so smart'),
      ],
    );
    //建议使用这种构造函数
    Widget list2 = ListView.builder(
        itemCount: 20,
        itemBuilder: (context, index) {
          return Column(children: <Widget>[
            ListTile(
              onTap: () {
                showAlertDialog(context, index);
              },
              title: Text('$index'),
            ),
            Divider(
              height: 1,
              color: Colors.grey,
            )
          ]);
        });
    return Scaffold(
        appBar: new AppBar(
          title: new Text("ListView"),
          leading: new BackButton(),
        ),
        body: list2);
  }
}

void showAlertDialog(BuildContext context, int index) {
  showDialog(
      context: context,
      // Navigator.pop(context);要使用此处的上下文
      builder: (BuildContext context) => new AlertDialog(
              title: new Text("标题"),
              content: new Text("你点击了第$index个"),
              actions: <Widget>[
                new ElevatedButton(
                  child: new Text("取消"),
                  onPressed: () {
                    Navigator.pop(context);
                  },
                ),
                new ElevatedButton(
                  child: new Text("确定"),
                  onPressed: () {
                    Navigator.pop(context);
                  },
                )
              ]));
}
